<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf8">
        <title>搜搜地图测试</title>
        <style>
            #container {
            }
            
            .popshow {
                display: block;
                width: 500px;
                height: 300px;
                margin: 0px auto;
                background: #eee;
                color: #222;
                top: 100px;
            }
            
            .pophide {
                display: none;
            }
            
            .popup {
                display: none;
                height: 300px;
                margin: 0px auto;
                left: 255px;
                top: 173px;
                width: 458px;
                background: #eee;
                color: #222;
                top: 100px;
            }
            
            #pop #popheader {
                font: bold;
                border-bottom: 1px dotted #333;
                padding: 4px 14px;
            }
            
            #pop #popheader .pop_close {
                float: right;
                color: red
            }
            
            #topLink li div.systemM {
                position: absolute;
                top: 80px;
                left: 80px;
                width: 120px;
                background: #fff;
                border: 1px solid #687179;
                border-top: none;
                z-index: 0;
                display: none;
                -moz-border-radius: 3px 0px 3px 3px;
                -webkit-border-radius: 3px 0px 3px 3px;
                border-radius: 3px 0px 3px 3px;
            }
            
           /* #topLink li:hover .systemM {
                display: block;
                color: red;
            }
            */
        </style>
        <script src="../js/jquery-1.4.4.min.js">
        </script>
        <script>
            			$(function(){
            				var str='';
            				for(var i=0; i<1000; i++){
            					str+='<br />他有'+i+'个老婆';
            					if(i>10 && i<50){ str+=',啧啧，不错';}
            					if(i>50 && i<100){ str+=',够了吧!';}
            					if(i>100){ str+=',你没有爱心，太狂了 ';}
            					if(i % 20 == 0){
            						str+='<a href="#" class="login">第'+i+'个登录</a>';
            					}
            				}
            				$('#teststr').append(str);
            				$('.login').click(function(){
            					//$('#pop').removeClass('pophide').addClass('popshow');
            					$('#pop').show();
            				});
            				$('.pop_close').click(function(){$('#pop').hide();});
							
							$('#topLink li.sBtn').hover(
								function(){$('.systemM').show('slow'); }  , function(){ $('.systemM').hide('slow'); }
							);
							
							
							$('.login2').click(function(){
								//$('#pop').slideDown('slow');
								$('#pop').slideToggle('slow');								
							});
							
 
            								
            			});
            			
            		
        </script>
    </head>
    <body>
        弹出div窗口popup测试
        <div id="loginPanel">
            <a href="#" class="login">登录</a>
			<a href="#" class="login2">slideDown登陆</a>
        </div>
        <div id="pop" style="width:500px; height:300px" class="popup">
            <div id="popheader">
                <span class="pop_close">X</span>这里是标题
            </div>
        </div>
        <hr/>
        <ul id="topLink">
            <li class="sBtn">
                <a href="#" id="">系统</a>
                <span class="arrow"></span>
                <div class="systemM">
                    <div style="margin:5px; line-height:20px; color:#333;" id="top_user_info">
                    </div>
                    <ul>
                        <li>
                            <a href="/login/?m=logout">退出系统</a>
                        </li>
                        <li>
                            <a href="/user/passwd.html">更改密码</a>
                        </li>
                    </ul>
                </div>
            </li>
            <li>
                <a href="#">短消息(
                    <label>
                        0
                    </label>)
                </a>
            </li>
            <li class="mapSearch">
                <a href="/map/global.html" target="_blank">地图展示</a>
            </li>
        </ul>
        <div id="teststr">
        </div>
    </body>
</html>
